<!DOCTYPE html>
<html lang="en">
<head>
    <title>Title</title>
    <!--共有部分-start-->
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge，chrome=1">
    <link rel="stylesheet" href="static/css/common.css">
    <script src="static/js/config.js"></script>
    <script src="static/lib/jquery.min.js"></script>
    <!--共有部分-end-->

    <link rel="stylesheet" href="static/css/home.css">
    <!--高德地图-->
    <script type="text/javascript" src='//webapi.amap.com/maps?v=1.3'></script>
    <!-- UI组件库 1.0 -->
    <script src="//webapi.amap.com/ui/1.0/main.js"></script>
</head>
<body>
<!--公用导航-start-->
<div class="header">
    <div class="inner">
        <div class="logo">
            <a href=""></a>
        </div>
        <div class="info">
            <span class="date">2017年10月10日</span>&nbsp;&nbsp;<span class="day"></span>&nbsp;&nbsp;|&nbsp;&nbsp;报料人&nbsp;&nbsp;<span class="informer">1212</span>&nbsp;位&nbsp;&nbsp;当前在线<span class="online">123123</span>人
        </div>
        <div class="user">
            <a href=""><span class="icon-user"></span><em>登录</em></a>
            <a href=""><span class="icon-search"></span><em>查找</em></a>
        </div>
    </div>
</div>
<div class="nav">
    <div class="inner">
        <ul>
            <li><a href="">首页</a></li>
            <li><a href="">最新</a></li>
            <li><a href="">热门</a></li>
            <li><a href="">报料反馈</a></li>
            <li><a href="">红黑榜</a></li>
            <li class="act"><a href="">附件报料</a></li>
        </ul>
        <a class="write" href="">
            <span class="icon-write"></span>
            <em>我要报料</em>
        </a>
    </div>
</div>
<!--公用导航-end-->

<div class="main">
    <div class="inner">
        <div class="select">
            <div class="location">
                <span class="icon-map">当前位置：</span>
                <span class="city">深圳市<span class="icon-select"></span></span>
                <span class="district">龙华区<span class="icon-select"></span></span>
            </div>
            <div class="choose">
                <a class="op-list" href="nearby.html"><span class="icon-list"></span><em>列表</em></a>
                <a class="op-map" href="map.html"><span class="icon-map01"></span><em>地图</em></a>
            </div>
        </div>

        <!--地图模式-->
        <div class="maps">
            <div id="maps"></div>

        </div>
    </div>
</div>

<div class="footer">
    <ul>
        <li>
            <a target="_blank" href="http://www.oeeee.com/about/index.html">关于奥一</a>
        </li>
        <li>
            <a target="_blank" href="http://user.oeeee.com/protocol/protocol_index.html">服务条款</a>
        </li>
        <li>
            <a target="_blank" href="http://em.oeeee.com/">全媒体营销中心</a>
        </li>
        <li>
            <a target="_blank" href="http://www.oeeee.com/sitemap/">网站地图</a>
        </li>
        <li>
            <a target="_blank" href="http://bbs.oeeee.com/thread-16786141-1-1.html">举报及建议</a>
        </li>
        <li>
            <a target="_blank" href="http://baoliao.oeeee.com/archiver/index.html">Archiver</a>
        </li>
    </ul>
    <span class="copyright">Copyright © 1996~2017 oeeee corporation. All Rights Reserved</span>
</div>

<script id="my-infowin-tpl" type="text/template">
    <div class="amap-ui-smp-ifwn-container">
        <a class="amap-ui-infowindow-close amap-ui-smp-ifwn-def-tr-close">&#10006;</a>
        <div class="amap-ui-smp-ifwn-content-body">
            <span><%= infoTitle %></span>
        </div>
        <div class="amap-ui-smp-ifwn-combo-sharp"></div>
    </div>
</script>

<script type="text/javascript">
    $(function () {
        //创建地图
        var map = new AMap.Map('maps', {
            resizeEnable: true,
            zoom:11
        });

        AMapUI.defineTpl("ui/overlay/SimpleInfoWindow/tpl/container.html", [], function() {
            return document.getElementById('my-infowin-tpl').innerHTML;
        });

        //地图中添加地图操作ToolBar插件
        map.plugin(['AMap.ToolBar'], function() {
            //设置地位标记为自定义标记
            var toolBar = new AMap.ToolBar();
            map.addControl(toolBar);
        });

        AMapUI.loadUI(['overlay/SimpleInfoWindow'], function(SimpleInfoWindow) {

//            var marker = new AMap.Marker({
//                map: map,
//                zIndex: 9999999,
//                position: map.getCenter()
//            });

            var infoWindow = new SimpleInfoWindow({
                //模板, underscore
                infoTitle: '<span>华为渣男暴打70岁老丈人和妻子 只为</span>',
                //基点指向marker的头部位置
//                offset: new AMap.Pixel(0, -31)
            });

            function openInfoWin() {
                infoWindow.open(map, map.getCenter());
            }

            //marker 点击时打开
            /*AMap.event.addListener(marker, 'click', function() {
                openInfoWin();
            });*/

            openInfoWin();
        });

    })
</script>

</body>
</html>